<template>
  <div>
    <h2>父组件</h2>
    <h4>a: {{ a }}</h4>
    <h4>b: {{ b }}</h4>
    <h4>c: {{ c }}</h4>
    <h4>d: {{ d }}</h4>
    <!-- <Child :a="a" :b="b" :c="c" :d="d" v-bind="{x:100,y:200}" /> -->
    <!-- v-bind相当于下面这个 -->
    <!-- <Child :a="a" :b="b" :c="c" :d="d" :x="100" :y="200" /> -->

    <Child :a="a" :b="b" :c="c" :d="d" v-bind="{x:100,y:200}" :add="add" />
  </div>
</template>

<script setup lang="ts">
  import Child from './son.vue'
  import { ref } from 'vue'
  let a = ref(1)
  let b = ref(2)
  let c = ref(3)
  let d = ref(4)
  const add = (val:number) => {
    a.value += val
  }
</script>

<style>

</style>